<template>
  <basic-container :btnFlag=true>
    <div class="card-border">
      <card-header :header-data="headerData"></card-header>
      <div style="float: right;margin-right: 12px;margin-top: 15px;margin-bottom: 10px;">
        <el-button type="primary" size="mini" @click="opinionCollectionRevise()" v-if="stateControlBtn=='0'">新增征求意见</el-button>
      </div>
      <div class="card-body">
        <el-table
          :data="tableData"
          style="width: 100%"
          row-key="id"
          :row-class-name="tableRowClassName"
          border
          default-expand-all
          :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
          ref="subjectTreeTable">
          <el-table-column
            align="left"
            prop="mainTitle"
            label="征求主题">
          </el-table-column>
          <el-table-column
            align="center"
            prop="deptName"
            label="发起部门"
            width="180">
          </el-table-column>
          <el-table-column
            align="center"
            prop="targetDeptName"
            label="反馈部门"
            width="180">
          </el-table-column>
          <el-table-column
            align="center"
            prop="state"
            label="状态"
            width="80"
            :formatter="formatterState">
          </el-table-column>
          <el-table-column
            align="center"
            width="120">
            <template slot="header" slot-scope="scope">
              <span>操作</span>
            </template>
            <template slot-scope="scope">
              <div class="menu-title" @click.stop="viewLevyDeptAll(scope.row,scope.index)"
                   v-if="scope.row.mainTitle==null&&scope.row.state!='0'&&scope.row.state!='1'">
                <i class="iconfont iconview icon-primary"></i>
                <p class="menu-title-text">查看反馈</p>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div>
          <el-pagination
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :page-sizes="[5, 10, 20, 30, 40 ,50]"
            :current-page="page.currentPage"
            :page-size="page.pageSize"
            :total="page.total"
            layout="total, sizes, prev, pager, next, jumper"
            class="paginationcss">
          </el-pagination>
        </div>
      </div>
      <!--反馈详情弹窗-->
      <el-dialog title="反馈详情" :visible.sync="dialogVisible" width="70%">
        <div style="margin-top: -48px">
          <bostech-detail :detail-data="detailData"></bostech-detail>
          <div style="margin-top: 15px;margin-left: 31px;">
            <p class="" style="float:left;font-weight: 600;margin-bottom: 0px;">附件 ：</p>
            <div v-for="(file,index) in files" :key="index" class="relateddiv">
              <el-tooltip class="item" effect="dark" content="下载资料" placement="top-start">
                <el-button class="downbtn" @click="fileDownload(file.fileId,file.fileName)">
                  <img src="img/download-blue.png" class="detail-data-img"/><span>下载</span>
                </el-button>
              </el-tooltip>
              <p class="detail-data-file" v-if="file.fileName">{{file.fileName}}</p>
            </div>
            <p class="detail-data-file" v-if="files.length==0">无</p>
          </div>
        </div>
        <span slot="footer" class="dialog-footer">
            <el-button type="success" @click.stop="agreeFeedback()" v-if="stateControlBtnBack">采 纳</el-button>
            <el-button type="primary" @click.stop="disagreeFeedback()" v-if="stateControlBtnBack">不采纳</el-button>
          <!--<el-button type="info" @click.stop="rejectFeedback1()" v-if="stateControlBtnBack">退回修改</el-button>-->

            <el-button @click="dialogVisible = false">关 闭</el-button>
        </span>
      </el-dialog>
      <!--不采纳弹窗-->
      <el-dialog title="不采纳理由" :visible.sync="dialogVisibleDisagree">
        <el-input
          type="textarea"
          v-model="disagreeOpinion"
          rows="3"
        >
        </el-input>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="disagreeComitYes()">确 定</el-button>
          <el-button @click="dialogVisibleDisagree = false">取 消</el-button>
        </div>
      </el-dialog>
    </div>
  </basic-container>
</template>

<script>
  import {getOpinionBackTreeList,formOpinion,agreeOpinion,disagreeOpinion} from "@/api/opinion";
  import {getNotNull,getFileTypeFiles} from '@/views/util';
  import fileTypeMixin from "@/mixins/fileTypeMixin";

  export default {
    name: "collectionListRevise",
    mixins:[fileTypeMixin],
    created() {
      this.putTableData();
      this.stateControlBtn = this.$route.query.state;
    },
    data() {
      return {
        headerData: {
          title: '修订调整-征求意见'
        },
        typetemp: '',
        stateControlBtn:'',
        tableData:[],
        dialogVisible:false,//反馈详情弹窗
        dialogVisibleDisagree:false,//不采纳弹窗
        detailData:[],//反馈详情
        targetIdTemp:0,//用于采纳，不采纳，退回修改操作中传参
        disagreeOpinion:'',//不采纳理由
        files:[],//用于查看反馈详情的附件显示
        stateControlBtnBack:false,//用于查看反馈中处理按钮的显示
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 2 // 每页显示多少条
        },


        formatterState: function (row, value, label, column) {
          if (row.state == '0') {
            return "催办";
          } else if (row.state == '1') {
            return "待反馈";
          } else if (row.state == '2') {
            return "退回";
          } else if (row.state == '3') {
            return "不采纳";
          } else if (row.state == '4') {
            return "已反馈";
          } else if (row.state == '5') {
            return "已采纳";
          }
        },
      }
    },
    methods: {
      // 发起征集意见
      opinionCollectionRevise() {
        let src = `/opinionCollectionRevise/add/${this.$route.params.id}`;
        this.$router.push({
          path: src,
          query: {
            type: this.$route.query.type,
            title:this.$route.query.title,
            achievementTitle:this.$route.query.achievementTitle,
            orgName:this.$route.query.orgName,
          }
        })
      },
      putTableData() {
        getOpinionBackTreeList(Object.assign({
          current: 1,
          size: 10,
          relateId:this.$route.params.id,
          type:'9'
        })).then(response => {
          this.tableData = response.data.data.records;
          this.page.total = response.data.data.total;
        })
      },
      tableRowClassName({row, rowIndex}) {
        if (row.state == undefined) {
          return 'success-row';
        }
        return '';
      },
      //查看反馈弹出反馈的详情
      viewLevyDeptAll(row) {
        if(row.state=='4'){
          this.stateControlBtnBack = true
        }
        this.targetIdTemp = row.targetId;
        formOpinion(Object.assign({
          opinionId:row.opinionId,
          targetId:row.targetId,
        })).then(async response =>{
          var records = response.data.data.records[0];
          this.detailData=[
            {label: '意见类型', value: this.hasOpinionOrNot(records.hasOpinion)},
            {label: '意见', value: getNotNull(records.opinion)},
            {label: '联系人', value: getNotNull(records.contactName)},
            {label: '联系电话', value: getNotNull(records.contactNumber)},
          ];
          if(records.fileIds.length!=0){
            this.files = await getFileTypeFiles(records.fileIds);
          }
        });
        this.dialogVisible = true;

      },
      // 采纳
      agreeFeedback() {
        this.$confirm("确定采纳?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          agreeOpinion(this.targetIdTemp).then(response => {
            if (response.data.code == 0) {
              this.$notify({
                title: '成功',
                message: '采纳成功',
                type: 'success',
                duration: 2000
              });
              this.$router.go(0);
            }
          })
        })
      },
      // 不采纳弹框
      disagreeFeedback() {
        this.dialogVisibleDisagree = true;
      },
      // 不采纳
      disagreeComitYes() {
        if (!this.disagreeOpinion) {
          this.$notify({
            title: "提醒",
            type: "warning",
            message: "请填写不采纳理由!",
            duration: 2000
          });
          return
        }
        this.$confirm("确定不采纳?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          disagreeOpinion(Object.assign({
            targetId: this.targetIdTemp,
            opinion: this.disagreeOpinion,
          })).then(response => {
            if (response.data.code == 0) {
              this.$notify({
                title: '成功',
                message: '提交成功',
                type: 'success',
                duration: 2000
              });
              this.dialogVisibleDisagree = false;
              this.$router.go(0);
            }
          })
        })
      },
      hasOpinionOrNot(val){
        if(val){
          return'修改意见';
        }else {
          return'无意见';
        }
      },
      handleSizeChange(val) {
        var page = this.page;
        page.pageSize = val;
        this.pageputTableData(page);
      },
      handleCurrentChange(val) {
        var page = this.page;
        page.currentPage = val;
        this.pageputTableData(page);
      },
      pageputTableData(page) {
        getOpinionBackTreeList(Object.assign({
          current: page.currentPage,
          size: page.pageSize,
          relateId:this.$route.params.id,
          type:'9'
        })).then(response => {
          this.tableData = response.data.data.records;
          this.page.total = response.data.data.total;
        })
      },
    }
  }
</script>

<style lang="scss" scoped>
  .card-body {
    padding: 10px;
    min-height: 400px;
    padding-bottom: 65px;
  }
  .paginationcss {
    margin-top: 20px;
    float: right;
    margin-right: 28px;
  }
</style>
